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Perkenalan Awal 
untuk Anda yang Pemula 


Apakah Anda sekarang sudah mempunyai website? Jika belum, mulailah 
untuk membuat. Saya berharap, Anda yang telah membuka halaman ini 
telah tahu cara dasar membuat website yang mudah. Tidak masalah jenis 
websitenya seperti apa pun. Karena teknologi Flash ini dapat diterapkan 
di berbagai jenis website. 


Jika Anda belum tahu cara membuat website, sekarang telah banyak 
beredar buku panduan cara membuat website dengan mudah. Anda bisa 
membaca buku-buku tersebut sebelum melanjutkan panduan di buku ini. 


Lalu apakah saya harus menutup buku ini dan membeli buku lain? 


Setidaknya Anda masih bisa membeli buku ini beserta buku panduan 
dasar membuat web lainnya. Jadi, tidak perlu mondar-mandir ke toko 
buku bukan? NA 


Atau, Anda punya sebuah blog? Nah, kalau punya berarti buku ini tetap 
cocok untuk Anda. Karena efek Flash memukau tetap dapat Anda 
terapkan pada Blog. 


Gambar 1.1 Jika Anda telah mempunyai Blogger, Anda tetap bisa 
menerapkan efek Flash. 


Nah, jika Anda sudah paham cara membuat website atau telah 
mempunyai Blog, sekarang saatnya untuk mengembangkannya dengan 
teknologi Flash agar kian menarik. Sebelum itu, ada baiknya Anda 
pahami dahulu apa itu Flash. 


II Apa Itu Flash? 


Flash adalah efek yang membuat gambar menjadi bergerak dan menarik. 


Anda pernah melihat gambar Animasi di suatu website? Nah, itulah 
sebuah Flash. Yakni gambar bergerak yang ada di dalam web. Namun 
yang akan kita bahas di sini tidak sekadar gambar bergerak saja, tapi suatu 
objek yang bisa kita kendalikan dengan mudah. 


Seiring perkembangannya, Flash bisa dipakai dalam sebuah web. Lebih 
interaktif, lebih responsif, dan menarik. Banyak sekali efek-efek Flash 
yang bisa Anda terapkan pada website. 


Berikut ini contoh cuplikan gambar website yang menggunakan teknologi 
Flash. 


AXISPORTFOLIO 


JELLYFISH 


Bagaimana? Mengagumkan bukan? Kelihatannya memang hanya gambar 
hitam-putih yang tak bergerak. Untuk dapat melihat contoh-contoh efek 
Flash yang akan dibahas pada buku ini, silakan lihat Bonus CD buku ini. 
Terdapat pada folder Efek Flash. 


4 NI Search CD Bonus 


kinlibrary v — Sharewith v Burn Newfolder vi 
Name ia Date modified Type Size 


2013 20:09 le folder 


File folder 


| File latiha 12/03/2013 10:00 
module Joomla 13/03/2013 6:51 File folder 


 — — — 


Totalnya ada sepuluh Efek Flash. Anda bisa memilih Efek flash mana saja 
yang ingin diterapkan pada website. 


» CDBonus » EfekFlash » ” Ig Search Efek Flash 


Sharewith v Burn New folder H: - 
Name : Date modified Type 
3d-banner 23/01/2013 5:31 File folder 
3d-wall 15/12/2012 11:26 File folder 
1 blur-menu 23/01/2013 13:58 File folder 
WB dock-gallery 23/01/2013 8:27 File folder 
hk image-zoomer 01/02/2013 14:07 File folder 
page-flip 12/03/2013 6:59 File folder 
(RK slide-product-viewer 04/12/2012 5:03 File folder 
| tabbed-content 01/02/2013 14:14 File folder 
| weather-widget 23/01/2013 14:04 File folder 
youtube-vimeo-player 13/12/2012 13:59 File folder 


3 


Jika Anda ingin melihat Demo untuk masing-masing efek Flash, silakan 
masuk ke salah satu folder efek Flash (dalam hal ini saya memilih efek 
Flash 3-d-banner). 


Name Date modified Type Size 


TI 


il TOTGEI 


15/12/2012 11:26 File folder 


. 3d-wall $ 

| blur-menu 23/01/2013 13:58 File folder 
| dock-gallery 23/01/2013 8:27 File folder 
Mm lama ma —. co. OM MATMUM LAI ta Latin 


Lalu klik ganda file index.html, maka efek Flash tersebut akan tampil di 
dalam Browser. 


Name Date modified Type Size 

di assets 03/06/2011 9:46 File folder 

( images 28/01/2011 11:24 File folder 

IM, 3DBannerFX 24/09/2012 14:58 SWF File 27: 
| images 09/06/2011 15:31 XML File z 
|@ index N 07/05/201215:44 Chrome HTML Do... 1 
5) readme 24/09/201215:11 Text Document £ 
(| settings 3 XML File 

"5! swfobject JScript Script File 1 


Oh iya, pastikan juga browser Anda telah mendukung Flash agar efeknya 
bisa tampil. 


Efek Flash yang kita bahas ini bisa diterapkan pada berbagai jenis website. 
Seperti website konvensional maupun website CMS berbasis Joomla dan 
WordPress. Jadi, pada bab selanjutnya saya akan jelaskan bagaimana cara 
menerapkan efek Flash tersebut pada website Anda. 


Tak hanya itu, efek Flash ini juga bisa diterapkan pada halaman Blogger 
juga loh. Bagaimana caranya? Tentu Anda harus menyiapkan yang 
namanya Hosting. 


Apa itu hosting? Hmmm... Ada baiknya Anda membaca buku saya 
sebelumnya agar mendapat pemahaman mendalam tentang Hosting. 
Buku yang berjudul “Kreatif Membuat Website Profesional” terbitan PT 
Elex Media Komputindo untuk mendapatkan pemahaman tentang 
hosting dan dasar-dasar tentang website. 


- 
Kreatif 


Membuat Website 
Profesional 


R Dadan 
KERNG “com 


Gambar 1.2 Anda bisa membaca buku ini untuk mendapatkan 
pengetahuan dasar tentang Website dan Hosting. 


Oke, balik lagi ke topik Flash. Normalnya sih untuk membuat sebuah 
Efek Flash diperlukan suatu software pembuat Flash. Software pembuat 
Efek Flash yang paling terkenal adalah Adobe Flash, yang sekarang sudah 
mencapai versi CS6. Namun, untuk bisa membuat Flash dengan software 
tersebut, Anda harus mempelajari dulu fungsi-fungsi yang ada pada 
software tersebut. 


Beritanya 
baiknya kini Anda 
dapat menerapkan 
efek Flash tersebu 

dengan mudah 
dan praktis. 


Nah, tepatlah Anda memegang buku ini. Karena Anda tidak perlu waktu 
berlama-lama untuk membuat Efek Flash memukau. Cukup dengan 
pengetahuan dasar tentang website maka Anda dapat dengan mudah 
menerapkan efek Flash. 


Belum tahu cara membuat website dan Blogger? Nakal yah sudah mem- 
baca sampai sini. Silakan Anda pelajari dulu pengetahuan dasar tentang 
website ataupun Blogger. Daripada nanti ke depan Anda bingung. Tapi 
tetap pegang buku ini yah, sebagai pemandu Anda. NN 


1.2 Beragam Manfaat €fek Flash 


Selain mempercantik halaman website, efek flash juga berguna untuk 
membuat halaman menjadi lebih ringkas. 


Ringkas karena untuk merangkum tulisan atau kumpulan konten lainnya 
cukup diperlukan satu efek flash. Contohnya efek flash tab yang bisa Anda 
lihat penampilannya di bawah ini. 


DESCRIPTION 


vulputate ullamcorper suscipit. Duis non velit nisi. Aenean eget guam non mi 
posuere lerisgue aliguam non eros. Donec ligula nisl, porttitor eu gravida 
et, pellentesgue a nulla.Lorem ipsum d sit amet, consectetur adipiscing 


elit. Fusce eu leo abitur congue vehicula eros, non facilisis leo 


ullamcorper fringilla magna, cipit dolor condimentum a. Nullam luctus 


conseguat vel. Fusce facilisis felis non ante tincidunt sollicitudin. Ut | 


sapien et enim cursus eget tempus enim adipiscing. 


Ouality above everything else 


Terlihat untuk memuat suatu konten website, kita hanya perlu satu efek 
flash. Dengan begitu, kita tidak perlu membuat banyak halaman web 
untuk setiap konten. Lebih ringkas bukan? 


Manfaat yang ketiga adalah efek Flash akan membuat website Anda lebih 
atraktif. Atraktif di sini saya artikan setiap tindakan dari pengunjung 
website akan membuat efek Flash itu bergerak. 


Anda bisa lihat gambar berikut ini. 


. 908m 


Gambar 1.3 Horizontal Pop Menu, salah satu efek Flash yang atraktif. 


Terlihat pada gambar di atas, kalau mouse kita dekatkan pada objek 
tertentu, maka objek tersebut akan bergerak sedikit ke atas dan berwarna. 
Ini adalah salah satu contoh efek Flash yang atraktif. Artinya, setiap 
tindakan yang diberikan oleh pengunjung website akan berdampak pada 
objek tertentu sesuai pengaturannya. 


Jangan-jangan 
ada efek Fiash 
yang kalau diklik 
akan meledak? 


Menarik yah, dengan efek Flash, Anda dapat membuat halaman website 
yang begitu menarik dan ringkas. Sehingga membuat pengunjung website 
Anda tertarik untuk berlama-lama menatapi layar monitor. Apalagi kalau 
website Anda menawarkan suatu produk. Pasti akan meningkatkan citra 
dan penjualan produk Anda sendiri. 


Oh iya, itu dia satu lagi manfaat dari efek Flash. Bisa meningkatkan 
penjualan produk Anda. Karena efek flash juga bisa digunakan untuk 
memajang produk Anda di website dengan tampilan yang sangat menarik. 


Saya pernah membuatkan website perusahaan yang di dalamnya ada efek 
Flash untuk menampilkan produk perusahaan secara menarik. 


APM-I 2-7 WS 


Gambar 1.4 Efek Flash dapat memajang daftar produk secara lebih menarik. 


Dengan efek Flash seperti di atas, tidak perlu lagi membuat list produk 
memanjang ke bawah. Selain itu, walaupun produknya banyak, pengun- 
jung juga tidak akan bosan untuk menelusuri produk karena ditampilkan 
secara atraktif. 


Beda kalau kita tidak memakai efek Flash, apalagi bila produknya banyak. 
Pengunjung website pasti akan jenuh meskipun halaman itu telah di- 


paging. 
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1.3 Apa yang Hauv Dipewsiapkan 


Anda harus mempersiapkan beberapa hal sebelum mulai menggunakan 
efek Flash. Seperti browser yang telah mendukung efek Flash dan Plugin 
pada browser yang bernama Adobe Flash Player. Setelah itu persiapkan 
software editor Notepad-- dan Hosting. 


131 Browser 


Mengenai browser, penulis anggap Anda sudah mempunyai versi browser 
terkini. Kebanyakan browser masa kini sudah dapat mendukung tam- 
pilnya efek Flash. Tinggal ditambah Plug-ins Adobe Flash Player. 


Namun, jika di komputer Anda belum terpasang Browser versi terkini, 
Anda dapat langsung menginstalnya dari Bonus CD buku ini. Di situ saya 
telah sediakan Browser Google Chrome Versi 24. 


Gambar 1.5 Google Chrome, salah satu Browser yang bisa menampilkan 
efek Flash. 


139 Adobe Flash Player 


Setelah Browsernya siap, langkah selanjutnya adalah mempersiapkan 
Plugins Flash Player. 


Adobe Flash Player sendiri adalah Plug-ins (fitur tambahan) pada browser 
yang berguna untuk menjalankan efek Flash. Plug-ins tersebut dapat 
Anda unduh pada situs http://get.adobe.com/flashplayer/. 


1" 


Tanpa plug-ins tersebut, browser Anda tidak dapat menjalankan efek 
Flash. Karena itu penting Anda persiapkan Plug-ins tersebut terlebih 
dahulu. 


f FLASH PLAYER 


We have detected that your missing or need to update your flash player. 


PF“ Please click here to install the latest Flash plugin. 


Lalu bagaimana kita tahu kalau Browser kita sudah terpasang Plug-ins 
Flash atau belum? 


Untuk mengeceknya, silakan Anda buka situs youtube.com. Kenapa harus 
youtube? Karena Youtube merupakan salah satu website yang meng- 
gunakan Flash dalam media playernya. 


Lihat, apakah video di situs tersebut bisa diputar atau tidak. Jika bisa 
berarti Browser Anda sudah terpasang Plug-ins Flash. Jika belum, berarti 
Anda harus menginstal Plug-insnya terlebih dahulu. 


Jika 
Browser Anda bisa memutar 


video ini, 


Selamat, Plug-ins Flash berarti sudah 


terinstal 


PSY - GANGNAM STYLE (bt MOH MV 


Gambar 1.6 Salah satu tanda Plug-in Flash sudah terpasang, 
yaitu bisa memutar video Youtube. 
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Biasanya dalam membuka 


website tertentu ada link yang kalau 


diklik maka plug-ins Flashnya akan 


langsung disinstal 


A plugin is needed to display this content. 
an UG 


Gambar 1.7 Jika belum terpasang, akan ada notifikasinya. 


133  Notepad--- 


Setelah Browser dan Plug-ins Flash sudah siap, persiapkan juga software 
Editor Text untuk mengedit File XML nantinya. Di sini saya telah 
menyediakan Notepad---- yang bisa Anda instal dari Bonus CD buku ini. 


Notepad"” 


Gambar 1.8 Notepad-4-4, editor text yang ringan dan powerful. 


Alasan mengapa penulis merekomendasikan software itu karena 
Notepad-#-- adalah editor text yang ringan serta terdapat nomor pada 
setiap barisnya. Hal itu akan memudahkan kita dalam mengedit kode- 
kode program. 
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TEE PEN Ver 102 2 AM eLNA Megan IN 
ve Tem x 


Pandangan Format Bahasa Pengituan Micro Isankan Tedi Pagi Wndow | 


Terdapat 
nomor pada 
setiap baris 


le Mavbug Langunga Fin RIDE chan TS bytes 131 | Cai Ia:3 Obyinr) ind angs 


Gambar 1.9 Terdapat penanda nomor pada setiap baris. 


Menginstal Notepad-#-- juga tergolong mudah dan praktis. Anda tinggal 
menjalankan filosofi Next dan Next saja. Setelah itu baru Finish. NN 


Namun, jika Anda masih awam untuk instalasi Notepad-#--, telah saya 
sediakan video tutorialnya dalam Bonus CD buku ini. Silakan Anda lihat 
langkah-langkah instalasinya pada video tersebut. 


13.4 Hosting 


Selanjutnya mempersiapkan tempat bernaungnya efek Flash tersebut. 
Yaitu hosting. Bagi Anda yang telah bisa membuat website dari awal, 
tentu istilah Hosting sudah tidak asing lagi bukan. 


Mengapa kita membutuhkan hosting? Jawabannya tentu agar efek Flash 
yang kita pasang diakses oleh pengunjung website. Karena setiap file yang 
kita upload ke Hosting itu bisa diakses oleh pengguna internet di seluruh 
dunia. 


Tentu kita ingin agar efek Flash tersebut dapat dilihat oleh banyak orang 
bukan. Karena itulah kita membutuhkan Hosting. 
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Sekarang saya anggap Anda telah mempunyai website yang telah online, 
jadi tentunya Anda telah mengerti bagaimana cara meng-upload file ke 
hosting. 


Oh iya, jika Anda mempunyai akun Blogger, efek Flash tidak dapat 
langsung diterapkan. Oleh karena itu, Hosting juga tetap diperlukan. 
Karena Blogger tidak menyediakan Hosting sendiri. 


Anda dapat mendaftar pada hosting Gratisan sebagai percobaan. Banyak 
sekali hosting layanan gratis yang bertebaran di Internet. Salah satunya 
yang beralamat di www.hosting-mantap.tk. 


Silakan Anda persiapkan dahulu Hostingnya. Untuk pendaftaran pada 


www.hosting-mantap.tk panduannya telah tersedia dalam Bonus CD 
buku ini. 


Gambar 1.10 Hosting adalah wadah untuk menempatkan file Flash kita. 


13.5 Memahami Kode XML 


Nah, setelah persiapan yang di atas sudah disediakan, selanjutnya per- 
siapan pada diri Anda. 


Yah, XML adalah kepanjangan dari Xtensible Markup Languange. Yaitu 
bahasa Markup yang digunakan untuk menyimpan data konfigurasi dari 
efek Flash. 


Apa 


Nanti dalam itu kode untuk 


membuat Bom? 


menerapkan efek Flash 


Anda akan berurusan 


dengan kode XML 


Gambar 1.11 Pengenalan kode XML akan memudahkan Anda 
mengatur efek Flash. 


Tenang saja, Anda tak perlu harus menguasainya kok. Yang penting Anda 
mengerti maksud dari setiap Tag-nya. Dan itu cukup mudah, mari saya 
tunjukkan contohnya. 


1 Essettings» 

HI «General Properties» 

«€componentWidth value-"600"/» 

4 €componentiHeight value-"374"/5 

Kasset3 value-"images.xm1l"/» 
aa 

K€slideShow value-"true"/» 


KSpreloader value-" 


«€s3topOnRollOver value-"true"/» 

€delay value-"2.5"/» 

10 KimageFitting value-"bestrit"/3 
KuseCustomColor value-"false"/» 

12 KcustomColor value-""/3 

13 KshowAbout value-"true"/» 

1 «noInitialAnimation value-"true"/» 

15 - «/General Properties» 

16 MH «Loading Transitions» 

KloadingTrans value-"assets/transitions/3Dfaces.xm1"/» 
18 KrandomTrans value-"false"/» 

19 |  «/Loading Transitions» 

HI «Text Effects» 

21 €textEff value-"assets/transitions/text.xm1"/» 
22 KrandomTextEff value-"false"/» 

«/Text Effects» 

24 HI «Image Effects» 

25 KimageEff value-""/s» 

KrandomimageEff value-"false"/» 

2 - «/iImage Effects» 


Gambar 1.12 Cukup ubah tulisan yang diberi kutip 
untuk mengubah konfigurasi. 
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Gambar di atas adalah contoh tampilan kode XML yang saya buka lewat 
Notepad-#-. Intinya, yang nanti Anda edit adalah tulisan yang diberi 
tanda kutip 2 ("...”). Itu adalah nilai (value) dari setiap konfigurasi efek 
Flash. Selebihnya tidak perlu diotak-atik. 


Nah, hanya sebatas itu yang perlu Anda pahami. Mudah kan? Atau masih 
bingung? Tenang saja, nanti setelah kita praktik, kebingungan Anda akan 
hilang dengan sendirinya. Prosesnya akan sangat menyenangkan karena 
kita bisa langsung melihat hasilnya. 


14 Benarkah Cfek Flash Dapat 
Memperlambat Website 


Benarkah itu? Jawabannya tergantung dari berapa banyak efek Flash 
dalam satu halaman. Jika terlalu banyak dan melebihi kebutuhan, efek 
Flash dapat memperlambat waktu loading. 


Namun jangan lupa bahwa selain itu, yang membuat lambat proses 
loading halaman adalah koneksi internet. Bisa jadi, efek Flash itu dapat 
berjalan dengan normal pada koneksi internet 1 mbps tapi terasa lambat 
pada kecepatan 345 kbps. 


Selain itu, bisa juga karena Bandwidth yang disediakan hosting terlalu 
minim sehingga aliran data yang masuk menjadi kecil. 


Banyak sekali faktor yang dapat membuat waktu loading website menjadi 
lambat. Jadi, bukan efek Flash satu-satunya yang membuat loading 
website menjadi lama. 


Memang efek Flash yang berlebihan dapat membuat kinerja website 
menjadi lama. Namun, dengan benar-benar mengetahui kebutuhan 
website, Anda tidak perlu meletakkan efek Flash yang tidak penting. 
Dengan begitu, efek Flash tidak akan terlalu memberatkan kinerja 
website. 


Selain itu, dengan menempatkan efek Flash seperlunya, akan membuat 
tampilan website Anda enak dipandang. Berbeda dengan menampilkan 
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efek Flash dengan jumlah yang banyak. Selain membuat halaman website 
menjadi lambat, halaman pun akan menjadi ruwet dan tidak enak di- 
pandang. 


Pada setiap bab yang membahas efek Flash, saya telah menyisipkan tip 
yang berguna untuk tata letak setiap efek Flash. Jadi, efek Flash Anda akan 
tetap tampil mempesona. Silakan baca tipnya pada masing-masing bab 
yang membahas efek Flash. 


Jadi, kesimpulannya agar efek Flash tidak memberatkan waktu Loading 
website, pasanglah efek Flash sesuai kebutuhan saja. 


Nah, itulah pengenalan dasar dan berbagai persiapan sebelum kita meng- 
gunakan efek Flash pada buku ini. Yang terpenting, Anda tetap semangat. 
Untuk selanjutnya Anda boleh meloncat ke bab mana saja, tergantung 
Efek Flash yang ingin Anda gunakan. 


Karena pada dasarnya setiap efek Flash sama dalam cara pemasangannya. 
Berarti Anda bebas memilih mau membaca bab yang mana dahulu atau 
yang Anda suka. 


Oke, sampai di sini kita sudah sampai pada penghujung bab satu. Intinya, 
kalau Anda sudah mengenal sekilas apa itu Flash, berarti Anda sudah siap 
untuk lanjut ke bab selanjutnya. 


Ternyata belajar 


Lanjut ke bab 


, Flash sangat mudah 
selanjutnya 


